<template>
	<data-modify ref="dataModify" label="角色" :formData="formData" @submit="$emit('submit', $event)">
		<template v-slot:form="scope">
			<el-form label-width="80px" :disabled="$refs['dataModify'] && $refs['dataModify'].method == 'remove'">
				<el-row>
					<el-col :span="12">
						<el-form-item label="角色名称">
							<el-input v-model="formData.roleName" size="mini" />
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</template>
	</data-modify>
</template>

<script>
import DataModify from '@/components/DataModify';

export default {
	components: {
		'data-modify': DataModify
	},
	data() {
		return {
			formData: {
				id: null,
				roleName: ''
			}
		};
	},
	methods: {
		add() {
			this.formData.id = null
			this.formData.roleName = null;
			this.$refs['dataModify'].open('add');
		},
		edit(row) {
			this.formData.id = row.id;
			this.formData.roleName = row.roleName;
			this.$refs['dataModify'].open('edit');
		},
		remove(row) {
			this.formData.id = row.id;
			this.formData.roleName = row.roleName;
			this.$refs['dataModify'].open('remove');
		}
	},
	mounted() {
		
	}
}
</script>